<template>
	<view class="Lu-wx-box">
		<view class="Lu-wx-logo">
			<view class="Lu-wx-logoimg"><image src="/static/image/applogo.png"></image></view>
			<view class="Lu-wx-logotit">趣一点</view>
		</view>
		<view class="Lu-wx-body">
			<view class="Lu-wx-tit">登录后应用将获取以下权限</view>
			<view class="Lu-wx-list1">
				<view class="Lu-wx-yuan"></view>
				<view class="Lu-wx-listtit">
					获得你的公开信息 (昵称、头像、地区 及性别)
				</view>
			</view>
			<view class="Lu-wx-list1 Lu-wx-list2">
				<view class="Lu-wx-yuan"></view>
				<view class="Lu-wx-listtit">
					寻找与你共同使用该应用的好友
				</view>
			</view>
			<view class="Lu-wx-argee" @tap="wxlogin">
				确认登录
			</view>
		</view>
	</view>
</template>

<script>
	import oneInput from '@/components/myp-one/myp-one.vue'
	import {
		mapState
	} from 'vuex';
	export default {
		computed: {
			...mapState(['hasLogin','userInfo','openId','apiUrl'])
		},
		data(){
			return {
				phone:''
			}
		},
		onLoad: function(option) {
			this.phone=option.phone;
		},
		methods:{
			wxlogin:function(){
				const _this = this
				uni.login({
					provider: 'weixin',
					success: function (loginRes) {
					console.log(loginRes);
					
					uni.getUserInfo({
						provider: 'weixin',
						success: function (infoRes) {
				            console.log(infoRes);
							const opneids = infoRes.userInfo.unionId
							const open_id = infoRes.userInfo.openId
							const unionId = infoRes.userInfo.unionId
							_this.$store.commit('setOpenid', opneids);
							uni.request({
								url:_this.apiUrl+'api/addUser',
								method:'POST',
								data:{
									openid:open_id,
									nickname:infoRes.userInfo.nickName,
									headImg:infoRes.userInfo.avatarUrl,
									pid:_this.pid,
									phone:_this.phone,
									unionid:unionId,
									type:2
								},
								success: (res) => {
									console.log(res)
									uni.request({
										url:_this.apiUrl+'api/userInfo',
										method:"POST",
										header:{
											openid:opneids
										},
										success: (res) => {
											console.log(res.data.data)
											// this.$store.commit('setToken', '1111');
											_this.$store.commit('login', res.data.data);
											// this.hasLogin = this.$store.state.hasLogin
											uni.switchTab({
											  url: '/pages/index/index'
											});
										}
									})
								}
							})
						}
					});
				  }
				});
			}
		}
	}
</script>

<style lang="scss">
	page{
		/* background-color: #f5f5f5; */
	}
	.Lu-wx-box{
		padding: 0 50rpx;
	}
	.Lu-wx-logo{
		margin-top: 150rpx;
		text-align: center;
		padding-bottom: 36rpx;
		border-bottom: 4rpx solid #efeeee;
		.Lu-wx-logoimg{
			width: 130rpx;
			height: 130rpx;
			margin: 0 auto;
			image{
				width: 130rpx;
				height: 130rpx;
			}
		}
		.Lu-wx-logotit{
			font-size: 40rpx;
			color: #333333;
			margin-top: 30rpx;
		}
	}
	.Lu-wx-body{
		margin-top: 40rpx;
		.Lu-wx-tit{
			font-size: 32rpx;
			color: #333333;
			
		}
		.Lu-wx-list1{
			display: flex;
			align-items: flex-start;
			justify-content: start;
			margin-top: 40rpx;
			.Lu-wx-yuan{
				width: 18rpx;
				height: 18rpx;
				border-radius: 50%;
				background-color: #aaaaaa;
				margin-top: 16rpx;
			}
			.Lu-wx-listtit{
				font-size: 30rpx;
				color: #999999;
				margin-left: 34rpx;
			}
		}
		.Lu-wx-list2{
			
		}
		.Lu-wx-argee{
			width: 650rpx;
			height: 90rpx;
			line-height: 90rpx;
			text-align: center;
			font-size: 36rpx;
			background-color: #5cc261;
			margin-top: 60rpx;
			border-radius: 20rpx;
			color: #fff;
		}
	}
</style>
